<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" href="../../../lib/bootstrap/3.3.5/css/bootstrap.min.css"/>

</head>
<body>
<div id="res">
  <itemlist msg={{msg}} :items="items" :properties="properties" url={{url}}></itemlist>
</div>
<script src="../../../node_modules/vue/dist/vue.js"></script>
<script src="../../../node_modules/vue-resource/dist/vue-resource.js"></script>
<script src="Test2.js"></script>
<script>
  var AppService = {
    urlroot: "http://euvee.vicp.co/rest/task/",
    init: function () {
      Vue.http.options.root = this.urlroot;
    },
    find: function (success_callback, error_callback) {
      var url = this.urlroot;
      Vue.http.get(url).then(success_callback, error_callback)
    }
  }
  var svc = Object.create(AppService);

  var vm = new Vue({
    el: '#res',
    data: {
      msg: 'hello123',
      items: [],
      properties: [
        "id",
        "description",
        "deadline",
        "state",
        "principal"
      ]
    },
    methods: {
      //高级搜索
      _find: function () {
        var self = this;
        svc.find(function (response) {
          self.$set('items', response.data)
          console.log(self.items)
        }, function (response) {
          alert("Probably failed to connect the backend server! Pls check your server status!" + response.status);
        });
      }
    },
    ready: function () {
      this._find();
    }
  })
</script>
</body>
</html>
